<!--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
-->
<!DOCTYPE html>
<html>
<head>
		<title>Flatter a Personal Portfolio Category Flat Bootstarp Resposive Website Template | Home :: w3layouts</title>
		<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
		<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
		<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=Carrois+Gothic' rel='stylesheet' type='text/css'>
		<link href='http://fonts.googleapis.com/css?family=Merriweather:400,400italic,300,300italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
		<!-- js -->
		<script src="js/jquery.min.js"></script>
		<!-- //js -->
		<!-- for-mobile-apps -->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="keywords" content="Flatter Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template, 
		Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
		<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
				function hideURLbar(){ window.scrollTo(0,1); } </script>
		<!-- //for-mobile-apps -->
		<!-- start-smoth-scrolling -->
		<script type="text/javascript" src="js/move-top.js"></script>
		<script type="text/javascript" src="js/easing.js"></script>
		<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){		
					event.preventDefault();
					$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
				});
			});
		</script>
<!-- start-smoth-scrolling -->
</head>
	
<body>
<!-- banner -->
	<div class="banner1">
	<div class="container">
		<div class="navi">
			<div class="head-logo">
				<div class="logo">
					<a href="index.html">LOGO</a>
				</div>
				<div class="head-logo-right-icons">
					<div class="head-logo-right">
							<div class="fig11">
							</div>
							<ul>
								<li><a href="#" class="dot"> </a></li>
								<li><a href="#" class="mes"> </a></li>
								<li><a href="#">HIRE ME</a></li>
								<div class="clearfix"> </div>
							</ul>
					</div>
				</div>
				<div class="clearfix"> </div>
			</div>
			<div class="top-nav">
				<span class="menu"><img src="images/menu.png" alt="" /></span>
					<ul class="nav1">
						<li><a href="index.html">HOME</a></li>
						<li><a href="portfolio.html">PORTFOLIO</a></li>
						<li><a href="blog.html" class="active">BLOG</a></li>
					</ul>
					<script> 
							   $( "span.menu" ).click(function() {
								 $( "ul.nav1" ).slideToggle( 300, function() {
								 // Animation complete.
								  });
								 });
							
					</script>
			</div>
			<div class="clearfix"> </div>
		</div>
	</div>
	</div>
<!-- //banner -->
<!-- blog -->
	<div class="blog">
	<div class="container">
		<div class="blog-left">
			<div class="blog-left-text">
				<h3><a href="single.html"> Aenean eu odio nec dui tincidunt</a></h3>
				<a href="single.html"><img src="images/h.jpg" alt=" " /></a>
				<p>Molestie sollicitudin molestie malesuada. Curabitur aliquet quam id dui posuere dit. 
					Donec sollicitudin molestie malesuada. Lorem ipsum dolor sit amet, consecteturs.
					Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis,
					lobortis dignissim, pulvinar ac, lorem. Lorem ipsum dolor sit amet,
					consectetuer adipiscing elit. Praesent vestibulum molestie lacus. 
					Aenean nonummy hendrerit mauris. Phasellus porta. Fusce suscipit varius mi.
					Cum sociis natoque penatibus et magnis dis parturient montes, 
					nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio. Morbi…</p>
				<a href="single.html" class="read-m">Read More</a>
			</div>
			<div class="blog-left-text blog-left-text-mid">
				<h3><a href="single.html"> Aenean eu odio nec dui tincidunt</a></h3>
				<a href="single.html"><img src="images/i.jpg" alt=" " /></a>
				<p>Molestie sollicitudin molestie malesuada. Curabitur aliquet quam id dui posuere dit. 
					Donec sollicitudin molestie malesuada. Lorem ipsum dolor sit amet, consecteturs.
					Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis,
					lobortis dignissim, pulvinar ac, lorem. Lorem ipsum dolor sit amet,
					consectetuer adipiscing elit. Praesent vestibulum molestie lacus. 
					Aenean nonummy hendrerit mauris. Phasellus porta. Fusce suscipit varius mi.
					Cum sociis natoque penatibus et magnis dis parturient montes, 
					nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio. Morbi…</p>
				<a href="single.html" class="read-m">Read More</a>
			</div>
		</div>
		<div class="blog-right">
			<h3>Comments</h3>
			<div class="men-text">
				<div class="men">
					<span> </span>
				</div>
				<div class="men-txt">
					<a href="#">Admin</a>
					<p>03-01-2015</p>
				</div>
				<div class="clearfix"></div>
				<p class="text">Cum sociis natoque penatibus et magnis dis parturient montes,
				<span>nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio. Morbi…</span></p>
			</div>
			<div class="men-text men-text-mid">
				<div class="men">
					<span> </span>
				</div>
				<div class="men-txt">
					<a href="#">Admin</a>
					<p>03-01-2015</p>
				</div>
				<div class="clearfix"></div>
				<p class="text">Cum sociis natoque penatibus et magnis dis parturient montes,
				<span>nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio. Morbi…</span></p>
			</div>
			<div class="men-text">
				<div class="men">
					<span> </span>
				</div>
				<div class="men-txt">
					<a href="#">Admin</a>
					<p>03-01-2015</p>
				</div>
				<div class="clearfix"></div>
				<p class="text">Cum sociis natoque penatibus et magnis dis parturient montes,
				<span>nascetur ridiculus mus. Nulla dui. Fusce feugiat malesuada odio. Morbi…</span></p>
			</div>
			<div class="recent">
				<h3>Recent Posts</h3>
				<div class="fig-txt">
					<div class="fig-txt-fig">
						<img src="images/c.jpg" alt=" " />
					</div>
					<div class="fig-txt-text">
						<p><label>June 31,2013 at 12:30pm</label></p>
						<h4>Donec sollicitudin molestie</h4>
						<p>Aliquam dapibus tincidunt metus. 
						Praesent justo dolor, lobortis quis, lobortis dignissim.
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>
				<div class="fig-txt fig-txt-mid">
					<div class="fig-txt-fig">
						<img src="images/d.jpg" alt=" " />
					</div>
					<div class="fig-txt-text">
						<p><label>April 12,2011 at 10:30pm</label></p>
						<h4>Donec sollicitudin molestie</h4>
						<p>Aliquam dapibus tincidunt metus. 
						Praesent justo dolor, lobortis quis, lobortis dignissim.
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>
				<div class="fig-txt">
					<div class="fig-txt-fig">
						<img src="images/d.png" alt=" " />
					</div>
					<div class="fig-txt-text">
						<p><label>July 31,2015 at 9:30am</label></p>
						<h4>Donec sollicitudin molestie</h4>
						<p>Aliquam dapibus tincidunt metus. 
						Praesent justo dolor, lobortis quis, lobortis dignissim.
						</p>
					</div>
					<div class="clearfix"> </div>
				</div>
			</div>
			<div class="categories">
				<h3>Categories</h3>
				<ul>
					<li><a href="#">Aliquam dapibus tincidunt</a></li>
					<li><a href="#">Donec sollicitudin molestie</a></li>
					<li><a href="#">Fusce feugiat malesuada odio</a></li>
					<li><a href="#">Cum sociis natoque penatibus</a></li>
					<li><a href="#">Magnis dis parturient montes</a></li>
				</ul>
			</div>
		</div>
		<div class="clearfix"> </div>
	</div>
	</div>
<!-- //blog -->
<!-- footer -->
	<div class="footer">
	<div class="container">
		<div class="footer-left">
			<div class="msg">
				<span></span>
			</div>
			<div class="msg-right">
				<a href="#">CONTACT US</a>
			</div>
			<div class="clearfix"> </div>
		</div>
		<div class="footer-middle">
			<ul>
				<li><a href="#" class="dri"> </a></li>  
				<li><a href="#" class="v1"> </a></li>  
				<li><a href="#" class="twit"> </a></li> 
			</ul>
		</div>
		<div class="footer-right">
			<p>Template by<a href="http://w3layouts.com/"> w3layouts</a></p>
		</div>
		<div class="clearfix"> </div>
	</div>
	</div>
<!-- //footer -->
<!-- here stars scrolling icon -->
	<script type="text/javascript">
									$(document).ready(function() {
										/*
										var defaults = {
								  			containerID: 'toTop', // fading element id
											containerHoverID: 'toTopHover', // fading element hover id
											scrollSpeed: 1200,
											easingType: 'linear' 
								 		};
										*/
										
										$().UItoTop({ easingType: 'easeOutQuart' });
										
									});
	</script>
<!-- //here ends scrolling icon -->